<!--出库   修改-->
<template>
    <el-dialog title="编辑" :visible.sync="dialogVisible">
        <el-form ref="inventoryForm" :model="inventoryForm" :rules="inventoryRules" label-width="110px">
            <el-row :gutter="20">
                <el-col :span="12">
                    <el-form-item label="出库日期:" prop="outDate">
                        <el-date-picker v-model="inventoryForm.outDate" type="date" placeholder="出库日期"
                                        value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%">
                        </el-date-picker>
                    </el-form-item>
                </el-col>
                <!--                <el-col :span="12">-->
                <!--                    <el-form-item label="存货编码:" prop="code">-->
                <!--                        <el-input v-model="inventoryForm.code" placeholder="存货编码" :disabled="true"-->
                <!--                                  v-if="inventoryForm.id"/>-->
                <!--                        <el-input v-else v-model="inventoryForm.code" placeholder="存货编码"/>-->
                <!--                    </el-form-item>-->
                <!--                </el-col>-->
                <el-col :span="12">
                    <el-form-item label="生产车间:" prop="workshop">
                        <el-input v-model="inventoryForm.workshop" placeholder="生产车间"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="类别:" prop="dictCategory">
                        <el-input v-model="inventoryForm.dictCategory" placeholder="类别" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="存货名称:" prop="name">
                        <el-input v-model="inventoryForm.name" placeholder="存货名称" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="规格型号:" prop="model">
                        <el-input v-model="inventoryForm.model" placeholder="规格型号" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="计量单位:" prop="unit">
                        <el-input v-model="inventoryForm.unit" placeholder="计量单位" :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="数量:" prop="quantity">
                        <el-input type="number" v-model="inventoryForm.quantity" placeholder="数量"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="单价:" prop="unitFee">
                        <el-input type="number" v-model="inventoryForm.unitFee" placeholder="单价"
                                  :disabled="true"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="金额:" prop="totalFee">
                        <!--                        <el-input type="number" v-model="inventoryForm.totalFee" placeholder="金额" :disabled="true"/>-->
                        {{ inventoryForm.quantity * inventoryForm.unitFee }}
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="备注:" prop="remark">
                        <el-input type="textarea" :rows="2" v-model="inventoryForm.remark" placeholder="备注"/>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <span slot="footer" class="dialog-footer">
            <el-button @click="dialogVisible = false">取 消</el-button>
            <el-button type="primary" @click="submitForm('inventoryForm')">保存</el-button>
        </span>
    </el-dialog>
</template>

<script>
export default {
    data() {
        return {
            dialogVisible: false,
            inventoryForm: {
                id: '',
                outDate: '',
                workshop: '',
                // code: '',
                dictCategory: '',
                name: '',
                model: '',
                unit: '',
                quantity: '',
                unitFee: '',
                totalFee: '',
                remark: '',
            },
            inventoryRules: {
                outDate: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                // code: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // dictCategory: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // name: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // model: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // unit: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                quantity: [
                    {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                ],
                // unitFee: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ],
                // totalFee: [
                //     {required: true, message: this.$t('validate.required'), trigger: 'blur'}
                // ]
            }
        }
    },
    methods: {
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.inventoryForm.totalFee = this.inventoryForm.quantity * this.inventoryForm.unitFee
                    this.$http.put(`/stock/stockout`, this.inventoryForm).then(({data: res}) => {
                        if (res.code != 0) {
                            return this.$message.error(res.msg)
                        }
                        this.$message('保存成功');
                        this.dialogVisible = false
                        this.$emit('updateViews');
                    })
                } else {
                    this.$message({
                        message: '必填项不能为空',
                        type: 'info'
                    });
                    return false;
                }
            });
        }
    }
}
</script>